<%@ page language="java" pageEncoding="ISO-8859-1"%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>
<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html:html lang="true">
  <head>
    <html:base />

    <title><bean:message bundle="AlbumResources" key="jsp.title.listar"/></title>

	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="">
	<meta http-equiv="description" content="">

	<link rel="stylesheet" type="text/css" href="../extjs/ext-all.css" />
	<link rel="stylesheet" type="text/css" href="../extjs/tabs-example.css" />
	<link rel="stylesheet" type="text/css" href="../extjs/examples.css" />
	<script type="text/javascript" src="../extjs/ext-base.js"></script>
	<script type="text/javascript" src="../extjs/ext-all.js"></script>
	<script type="text/javascript" src="../extjs/examples.js"></script>
	<script type="text/javascript" src="../js/jquery.js"></script>
	<script type="text/javascript" src="../js/objTree.js"></script>
	<script type="text/javascript" src="../js/util.js"></script>
	<script type="text/javascript" src="../js/listarAlbumUsuario.js"></script>

	<style type="text/css">
		input {
			border: 1px #000000 solid;
			width: 20px;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 11px;
			margin-top: 0px;
			margin-right: 0px;
			margin-bottom: 0px;
			margin-left: 0px;
			padding-top: 1px;
			padding-right: 0px;
			padding-bottom: 1px;
			padding-left: 2px;
			height: 16px;
			text-align: center;
			display: none;
		}
		
		.desrep {
			font-family: Arial, Helvetica, sans-serif;
			font-size: 11px;
			text-decoration: none;
		}

		.tdFig {
			border: 2px solid white;
		}
		
		td {
			font-family: Arial, Helvetica, sans-serif;
			font-size: 12px;
			color: #000000;
		}
		
		.tituloAlbum {
			font-family: Arial, Helvetica, sans-serif;
			font-size: 12px;
			font-weight: bold;
			color: #000000;
		}
		
		.tabela {
			border-color: black;
			border-width: 1px;
			border-style: solid;
		}
	</style>
  </head>

<body>
	<logic:present name="list">
		<html:form action="/Album/CadastrarAlbumUsuario.do" styleId="frmAlbuns" method="POST">
		<html:hidden property="desejadas" styleId="desejadas"/>
		<html:hidden property="repetidas" styleId="repetidas"/>

		    <div id="album-tabs">
		    	<!-- Tab: Meus Albuns -->
		        <div id="meusAlbuns" title="Meus &Aacute;lbuns">
					<table width="95%" class="tabela" cellpadding="0" cellspacing="0">
						 <tr>
					         <td><bean:message bundle="AlbumResources" key="jsp.label.nome"/></td>
					         <td><bean:message bundle="AlbumResources" key="jsp.label.desejadas"/></td>
					         <td><bean:message bundle="AlbumResources" key="jsp.label.repetidas"/></td>
					         <td><bean:message bundle="AlbumResources" key="jsp.label.acao"/></td>
				        </tr>

				        <logic:iterate name="list" id="quantidadeFigurinhaBean">
				        	<tr>
				        		<td><bean:write name="quantidadeFigurinhaBean" property="albumDTO.nome"/></td>
				        		<td align="right"><bean:write name="quantidadeFigurinhaBean" property="quantidadeDesejadas"/></td>
				        		<td align="right"><bean:write name="quantidadeFigurinhaBean" property="quantidadeRepetidas"/></td>
				        		<td>
				        			<a href="../Album/PrepareEditarAlbumUsuario.do?codigo=<bean:write name="quantidadeFigurinhaBean" property="albumDTO.codigo"/>"><img src="../images/edit_icon.gif" border="0" alt="<bean:message bundle="AlbumResources" key="jsp.alt.edit"/> <bean:write name="quantidadeFigurinhaBean" property="albumDTO.nome"/>"/></a>
				        			&nbsp;&nbsp;
				        			<a href="javascript:excluirAlbumUsuario(<bean:write name="quantidadeFigurinhaBean" property="albumDTO.codigo"/>, '<bean:write name="quantidadeFigurinhaBean" property="albumDTO.nome"/>');"><img src="../images/delete_icon.gif" border="0" alt="<bean:message bundle="AlbumResources" key="jsp.alt.delete"/> <bean:write name="quantidadeFigurinhaBean" property="albumDTO.nome"/>"/></a>
				        		</td>
				        	</tr>
				        </logic:iterate>
				      </table>
		        </div>

				<!-- Tab: Novo Album -->
		        <div id="novoAlbum" title="Novo &Aacute;lbum">
	            	<br>
		            <table border="0" cellpadding="2" cellspacing="2" width="95%">
						<tr>
							<td width="130"><bean:message bundle="AlbumResources" key="jsp.label.nome"/>:</td>
							<td>
								<html:select property="codigoAlbum" styleId="codigoAlbum" onchange="carregarFigurinhas();">
									<html:option value="" />
									<html:options collection="listAlbuns" property="codigo" labelProperty="nome"/>
								</html:select>
							</td>
						</tr>
						<tr>
							<td width="130" align="left" valign="top">Figurinhas:</td>
							<td align="center" class="tituloAlbum"><br>
								<div id="divFigurinhas"></div>
							</td>
						</tr>
					</table>
		        </div>

		        <!-- Tab: Editar Album -->
		        <div id="editarAlbum" title="Editar &Aacute;lbum">
	            	<br>
		            <table border="0" cellpadding="2" cellspacing="2" width="95%">
						<tr>
							<td width="130"><bean:message bundle="AlbumResources" key="jsp.label.nome"/>:</td>
							<td>
								<html:select property="codigoAlbumUsuario" styleId="codigoAlbumUsuario" onchange="carregarFigurinhasUsuario();">
									<html:option value="" />
									<html:options collection="list" property="albumDTO.codigo" labelProperty="albumDTO.nome"/>
								</html:select>
							</td>
						</tr>
						<tr>
							<td width="130" align="left" valign="top">Figurinhas:</td>
							<td align="center" class="tituloAlbum"><br>
								<div id="divFigurinhasUsuario"></div>
							</td>
						</tr>
					</table>
		        </div>

		    </div>

      </html:form>
	</logic:present>

</body>
</html:html>
